import { Col, Row } from "antd";
import "./index.less";

const App = ({}) => {
  return (
    <>
      <Row justify="space-around" >
        <Col span={20}>
          <Row>
            <Col span={9}>
              <div className="dc-column-header" style={{ background: "rgba(0,0,0,0.06)" }}>
                <Row justify="center">
                <Col span={8} style={{ textAlign: "center" }}>
                    1
                  </Col>
                  <Col span={8} style={{ textAlign: "center" }}>
                    String
                  </Col>
                  <Col span={8} style={{ textAlign: "center" }}>
                    1
                  </Col>
                </Row>
              </div>
            </Col>
            <Col span={6}>
              <div style={{ paddingTop: 8 }}>
                <div className="connection dc-ui-flow-connection ">
                  <div className="canvas-wrap">
                    <div className="canvas-content flow-connection-content-1725687900057-0">
                      <div
                        style={{
                          position: "relative",
                          width: "auto",
                          height: "auto",
                          padding: 0,
                          margin: 0,
                          borderWidth: 0,
                          cursor: "default",
                        }}
                      >
                        <div className="pink-container">
                          <div className="pink-dot">
                            <div className="pink-hot-inner"></div>
                          </div>
                          <div className="pink-dashed-line"></div>
                          <div className="pink-dashed-line"></div>
                          <div className="pink-di-arrow-right-triangle"></div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </Col>
            <Col span={9}>
              <div className="dc-column-header" style={{ background: "rgba(0,0,0,0.06)" }}>
                <Row justify="space-between">
                  <Col span={8} style={{ textAlign: "center" }}>
                    1
                  </Col>
                  <Col span={8} style={{ textAlign: "center" }}>
                    String
                  </Col>
                  <Col span={8} style={{ textAlign: "center" }}>
                    1
                  </Col>
                </Row>
              </div>
            </Col>
          </Row>
        </Col>
      </Row>
    </>
  );
};

export default App;
